<?php
//$this->load->helper('directory'); 
?>
<!DOCTYPE HTML>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="keywords" content="<?= $this->meta_keywords ?>" />
    <meta name="title" content="<?= $this->meta_title ?>" />
    <meta name="description" content="<?= $this->meta_description ?>" />
    <meta name="uri-translation" content="on" />
    <title><?= $this->meta_title ?></title>

    <meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0" />
    
    <link rel="stylesheet" href="<?php echo base_url();?>public/galleries/css/supersized.css" type="text/css" media="screen" />
    <link rel="stylesheet" href="<?php echo base_url();?>public/galleries/theme/supersized.shutter.css" type="text/css" media="screen" />
    <link rel="stylesheet" href="<?php echo base_url();?>public/galleries/css/media.css">
    
    <script type="text/javascript" src="<?php echo base_url();?>public/galleries/js/jquery-1.8.3.min.js"></script>
    <script type="text/javascript" src="<?php echo base_url();?>public/galleries/js/jquery.easing.min.js"></script>
    <script type="text/javascript" src="<?php echo base_url();?>public/galleries/js/supersized.3.2.7.min.js"></script>
    <script type="text/javascript" src="<?php echo base_url();?>public/galleries/theme/supersized.shutter.min.js"></script>

	<script type="text/javascript">
			jQuery(function($){
				$.supersized({
				
					// Functionality
					slideshow               :   1,			// Slideshow on/off
					autoplay				:	0,			// Slideshow starts playing automatically
					start_slide             :   1,			// Start slide (0 is random)
					stop_loop				:	0,			// Pauses slideshow on last slide
					random					: 	0,			// Randomize slide order (Ignores start slide)
					slide_interval          :   3000,		// Length between transitions
					transition              :   6, 			// 0-None, 1-Fade, 2-Slide Top, 3-Slide Right, 4-Slide Bottom, 5-Slide Left, 6-Carousel Right, 7-Carousel Left
					transition_speed		:	1000,		// Speed of transition
					new_window				:	1,			// Image links open in new window/tab
					pause_hover             :   0,			// Pause slideshow on hover
					keyboard_nav            :   1,			// Keyboard navigation on/off
					performance				:	1,			// 0-Normal, 1-Hybrid speed/quality, 2-Optimizes image quality, 3-Optimizes transition speed // (Only works for Firefox/IE, not Webkit)
					image_protect			:	1,			// Disables image dragging and right click with Javascript
															   
					// Size & Position						   
					min_width		        :   0,			// Min width allowed (in pixels)
					min_height		        :   0,			// Min height allowed (in pixels)
					vertical_center         :   1,			// Vertically center background
					horizontal_center       :   1,			// Horizontally center background
					fit_always				:	0,			// Image will never exceed browser width or height (Ignores min. dimensions)
					fit_portrait         	:   1,			// Portrait images will not exceed browser height
					fit_landscape			:   0,			// Landscape images will not exceed browser width
															   
					// Components							
					slide_links				:	'blank',	// Individual links for each slide (Options: false, 'num', 'name', 'blank')
					thumb_links				:	1,			// Individual thumb links for each slide
					thumbnail_navigation    :   0,			// Thumbnail navigation
					slides 					:  	[			// Slideshow Images
												
												<?php 
												$count_img = sizeof($galleries);	
												$i = 0;
												//if($count_img > 0){
													foreach ($galleries as $gallery)
													{
													?>
														 {image : '<?php echo base_url()."upload/galleries/".$gallery['image'];?>', title : '<?php echo $gallery['description']?>', thumb : '<?php echo base_url()."upload/galleries/".$gallery['image'];?>', url : ''},
													<?php
													$i++;
													}//end loop
												//}
												?> 
												],
												
					// Theme Options			   
					progress_bar			:	0,			// Timer for each slide							
					mouse_scrub				:	0
					
				});
		    });
		    
		</script>
        
    <?php include('application/views/lyn/v_analyticstracking.php'); ?>

</head>
	<style type="text/css">
		ul#demo-block{ margin:0 15px 15px 15px; }
			ul#demo-block li{ margin:0 0 10px 0; padding:10px; display:inline; float:left; clear:both; color:#aaa; background:url('img/bg-black.png'); font:11px Helvetica, Arial, sans-serif; }
			ul#demo-block li a{ color:#eee; font-weight:bold; }
	</style>
    
    <body>
		<div class="main_logo">
        <img src="<?php echo base_url();?>public/galleries/img/main_logo.png" width="100%" height="100%" />
        </div>
        
        <!--End of styles-->
    
        <!--Thumbnail Navigation-->
        <div id="prevthumb"></div>
        <div id="nextthumb"></div>
        
        <!--Arrow Navigation-->
        <a id="prevslide" class="load-item"></a>
        <a id="nextslide" class="load-item"></a>
        
        <div id="thumb-tray" class="load-item">
            <div id="thumb-back"></div>
            <div id="thumb-forward"></div>
        </div>
        
        <!--Time Bar-->
       <!-- <div id="progress-back" class="load-item">
            <div id="progress-bar"></div>
        </div>-->
        
        <!--Control Bar-->
        <div id="controls-wrapper" class="load-item">
            <div id="controls">
                
                <!--<a id="play-button"><img id="pauseplay" src="img/pause.png"/></a>-->
            
                <!--Slide counter-->
                <!--<div id="slidecounter">
                    <span class="slidenumber"></span> / <span class="totalslides"></span>
                </div>-->
                
                <!--Slide captions displayed here-->
                <div id="slidecaption"></div>
                
                <!--Thumb Tray button-->
                <!--<a id="tray-button"><img id="tray-arrow" src="img/button-tray-up.png"/></a>-->
                
                <!--Navigation-->
                <!--<ul id="slide-list"></ul>-->
                
            </div>
        </div>
    
        <div class="clear_both"></div>
        <div class="bottom_slide">
            <!-- Here's all it takes to make this navigation bar. -->
            <ul id="nav">
            	<li>
				<?= anchor(
					"/galleries.html/1",
					'ROOMS',
					 $id == 1 ? 'class="current"' : "" );?>
                </li>
                <li>
                <?= anchor(
					"/galleries.html/2",
					'POOL & SPA',
					$id == 2 ? 'class="current"' : "" );?>
                </li>
                <li>
                <?= anchor(
					"/galleries.html/3",
					'HOTEL',
					$id == 3 ? 'class="current"' : "" );?>
                </li>
                <li>
                <?= anchor(
					"/galleries.html/4",
					'OTHERS',
					$id == 4 ? 'class="current"' : "" );?>
                </li>
            </ul>
            <!-- That's it! -->
        </div><!-- end bottom_slide -->
    </body>
</html>